<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>主页</title>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <link rel="shortcut icon" href="../static/img/favicon.ico" th:href="@{/img/favicon.ico}"/>
    <link rel="stylesheet" href="../static/sdk/antd.css" th:href="@{/sdk/antd.css}"/>
    <link rel="stylesheet" href="../static/sdk/helper.css" th:href="@{/sdk/helper.css}"/>
    <link rel="stylesheet" href="../static/css/iconfont.css" th:href="@{/css/iconfont.css}"/>
    <script src="../static/js/history.js" th:src="@{/js/history.js}"></script>
    <script src="../static/sdk/sdk.js" th:src="@{/sdk/sdk.js}"></script>
    <script src="../static/sdk/charts.js" th:src="@{/sdk/charts.js}"></script>
    <script src="../static/sdk/exceljs.js" th:src="@{/sdk/exceljs.js}"></script>
    <script src="../static/sdk/cropperjs.js" th:src="@{/sdk/cropperjs.js}"></script>
    <style>
        html,
        body,
        .app-wrapper {
            position: relative;
            width: 100%;
            height: 100%;
            margin: 0;
            padding: 0;
        }
    </style>
</head>
<body>
<div id="root" class="app-wrapper"></div>
<script>
    // dev：纯页面开发，prod：生产环境
    const env = "prod";
    const host = (env === "dev") ? "http://localhost:8001" : "[[${app.domain}]]";
    const site = (env === "dev") ? "website-dev-menu.json" : "get:HOST/user/menu";

    (function () {
        let amis = amisRequire('amis/embed');
        const match = amisRequire('path-to-regexp').match;

        // 如果想用 browserHistory 请切换下这处代码, 其他不用变
        // const history = History.createBrowserHistory();
        const history = History.createHashHistory();

        const app = {
            "type": "app",
            "api": site,
            "logo": host + "/img/logo.png",
            "brandName": "[[${app.name}]]",
            "header": {
                "type": "grid",
                "valign": "middle",
                "columns": [
                    {
                        "body": [
                            {
                                "type": "tpl",
                                "tpl": "<span style='color: #27bc67;'>当前时间：${DATETOSTR(NOW(), 'YYYY-MM-DD HH:mm:ss')}</span>"
                            }
                        ]
                    },
                    {
                        "body": [
                            {
                                "type": "flex",
                                "justify": "flex-end",
                                "items": [
                                    {
                                        "type": "avatar",
                                        "size": "small",
                                        "src": "[[${user != null ? user.avatar : ''}]]",
                                        "visibleOn": "[[${user != null && user.avatar != '' }]]",
                                    },
                                    {
                                        "type": "dropdown-button",
                                        "label": "[[${user != null ? user.nickname: ''}]]",
                                        "visibleOn": "[[${user != null && user.nickname != '' }]]",
                                        "buttons": [
                                            {
                                                "type": "button",
                                                "label": "个人中心",
                                                "actionType": "dialog",
                                                "dialog": {
                                                    "type": "dialog",
                                                    "title": "个人中心",
                                                    "size": "md",
                                                    "actions": [],
                                                    "body": {
                                                        "type": "service",
                                                        "schemaApi": "get:home/person.json"
                                                    }
                                                }
                                            },
                                            {
                                                "type": "button",
                                                "actionType": "ajax",
                                                "label": "退出登录",
                                                "api": "get:HOST/user/logout",
                                                "redirect": "HOST/login"
                                            }
                                        ]
                                    }
                                ]
                            }
                        ]
                    }
                ]
            },
            "footer": {
                "type": "tpl",
                "tpl": "<div style='text-align: center'>Copyright © 2020 - 2028 [[${app.author}]]. All rights reserved</div>"
            }
        };

        function normalizeLink(to, location = history.location) {
            to = to || '';
            if (to && to[0] === '#') {
                to = location.pathname + location.search + to;
            } else if (to && to[0] === '?') {
                to = location.pathname + to;
            }
            const idx = to.indexOf('?');
            const idx2 = to.indexOf('#');
            let pathname = ~idx
                ? to.substring(0, idx)
                : ~idx2
                    ? to.substring(0, idx2)
                    : to;
            let search = ~idx ? to.substring(idx, ~idx2 ? idx2 : undefined) : '';
            let hash = ~idx2 ? to.substring(idx2) : location.hash;
            if (!pathname) {
                pathname = location.pathname;
            } else if (pathname[0] !== '/' && !/^https?\:\/\//.test(pathname)) {
                let relativeBase = location.pathname;
                const paths = relativeBase.split('/');
                paths.pop();
                let m;
                while ((m = /^\.\.?\//.exec(pathname))) {
                    if (m[0] === '../') {
                        paths.pop();
                    }
                    pathname = pathname.substring(m[0].length);
                }
                pathname = paths.concat(pathname).join('/');
            }
            return pathname + search + hash;
        }

        function isCurrentUrl(to, ctx) {
            if (!to) {
                return false;
            }
            const pathname = history.location.pathname;
            const link = normalizeLink(to, {
                ...location,
                pathname,
                hash: ''
            });
            if (!~link.indexOf('http') && ~link.indexOf(':')) {
                let strict = ctx && ctx.strict;
                return match(link, {
                    decode: decodeURIComponent,
                    strict: typeof strict !== 'undefined' ? strict : true
                })(pathname);
            }
            return decodeURI(pathname) === link;
        }

        let amisInstance = amis.embed(
            '#root',
            app,
            {
                location: history.location
            },
            {
                replaceText: {
                    HOST: host
                },
                // watchRouteChange: fn => {
                //   return history.listen(fn);
                // },
                updateLocation: (location, replace) => {
                    location = normalizeLink(location);
                    if (location === 'goBack') {
                        return history.goBack();
                    } else if ((!/^https?\:\/\//.test(location) && location === history.location.pathname + history.location.search) || location === history.location.href) {
                        return;
                    } else if (/^https?\:\/\//.test(location) || !history) {
                        return (window.location.href = location);
                    }
                    history[replace ? 'replace' : 'push'](location);
                },
                requestAdaptor(api) {
                    api.headers["Authorization"] = localStorage.getItem("token");
                    return api;
                },
                responseAdaptor(api, payload, query, request, response) {
                    return payload;
                },
                jumpTo: (to, action) => {
                    if (to === 'goBack') {
                        return history.goBack();
                    }
                    to = normalizeLink(to);
                    if (isCurrentUrl(to)) {
                        return;
                    }
                    if (action && action.actionType === 'url') {
                        action.blank === false
                            ? (window.location.href = to)
                            : window.open(to, '_blank');
                        return;
                    } else if (action && action.blank) {
                        window.open(to, '_blank');
                        return;
                    }
                    if (/^https?:\/\//.test(to)) {
                        window.location.href = to;
                    } else if (
                        (!/^https?\:\/\//.test(to) &&
                            to === history.pathname + history.location.search) ||
                        to === history.location.href
                    ) {
                        // do nothing
                    } else {
                        history.push(to);
                    }
                },
                isCurrentUrl: isCurrentUrl,
                theme: 'antd'
            }
        );

        history.listen(state => {
            amisInstance.updateProps({
                location: state.location || state
            });
        });
    })();
</script>
</body>
</html>